<template>
  <el-dialog
    :title="title"
    :visible.sync="isVisible"
    :width="width"
    :before-close="handleClose"
    :lock-scroll="true"
    :close-on-click-modal="false"
    custom-class="pub_dialog"
    @open="getData"
  >
    <VForm
      ref="vformComponents"
      :form="formData.form"
      :options="formData.options"
      :rules="formData.rules"
      :labelWidth="formData.labelWidth"
      :rowspan="rowspan"
    ></VForm>

    <span slot="footer" class="dialog-footer">
      <el-button @click="cancel">取 消</el-button>
      <el-button type="primary" @click="sure" v-if="formData.form.examineResult ==3">再次申请</el-button>
    </span>
  </el-dialog>
</template>

<script>
  import { riskAccidentCasesDetail,
    riskAccidentCasesUpdate,
    riskAccidentCasesAdd,
    riskAccidentCasesApplySetCase} from '@/api/risk/accidentCases'
  import VForm from "@/components/VForm/index";
  export default {
    components: {
      VForm,
    },
    props: {
      width: {
        type: String,
        default: "70%",
      },
      title: {
        type: String,
        default: "申请详情",
      },
      id:{},
      dialogVisible: {
        type: Boolean,
        default: false
      },
    },
    watch: {
      'width': {
        handler(newVal, oldVal) {
          console.log('newVal===',newVal, oldVal)
          let w = this.width.split('%')[0]
          if(w>=60){
            this.rowspan = 2
          }else{
            this.rowspan = 1
          }
        },
        deep: true,
        immediate: true
      },
      'examineResultOptions':{
        handler(newVal, oldVal) {
          this.formData.options.forEach(t=>{
            if(t.key=='examineResult'){
              t.option.data = newVal
            }
          })
        },
        deep: true,
        immediate: true
      }
    },
    computed: {
      isVisible: {
        get() {
          return this.dialogVisible
        },
        set() {
          this.close()
        }
      }
    },
    data() {
      return {
        rowspan:1,
        dict:{},
        formData: {
          form: {
            name:"",
            examineApplyTime:"",
            examineResult:"",
            examineOption:""
          },
          options: [
            {
              title: "事故案例名称",
              key: "name",
              type: "text",
              disabled:true
            },
            {
              title: "申请时间",
              key: "examineApplyTime",
              type: "datetime",
              disabled:true
            },
            {
              title: "审核结果",
              key: "examineResult",
              type: "select",
              multiple:false,
              option: {
                data: this.examineResultOptions,
                props: {
                  key: "id", // 指定key对应data的字段
                  label: "label", // 指定label对应data的字段
                  value: "name", // 指定value对应data的字段
                },
              },
              disabled:true
            },
            {
              title: "审核意见",
              key: "examineOption",
              type: "textarea",
              columnWidth: 'w100max',
              disabled:true
            },
          ],
          rules: {
          },
          labelWidth: "140px",
        },
        // 字典
        examineResultOptions:[],

      };
    },
    methods: {
      initData(){
          this.formData.form.name = "",
          this.formData.form.examineApplyTime = "",
          this.formData.form.examineResult = "",
          this.formData.form.examineOption = ""
      },
      sure(){
        // 重新申请审批
        riskAccidentCasesApplySetCase(this.id).then(res=>{
          if(res.code==200){
            this.$message({
              message: "操作成功",
              type: 'success'
            })
            this.closeSuccess()
          }
        })
      },
      cancel(){
        this.close()
      },
      handleClose(done) {
        done()
        this.close()
      },
      closeSuccess(){
        this.initData()
        this.$refs.vformComponents.$refs.form.resetFields();
        this.$emit('success')
      },
      close(){
        this.initData()
        this.$refs.vformComponents.$refs.form.resetFields();
        this.$emit('close')
      },
      getData(){
        this.examineResultOptions=[]
        this.$commonJs.filterDataDict("riskAccidentCasesExamineResult",this.examineResultOptions)
          riskAccidentCasesDetail(this.id).then(res=>{
            if(res.code==200){
              this.formData.form = res.data
            }else{
              this.$message({
                message: this.$t('tips.systemException'),
                type: 'error'
              })
            }
          })
      }
    },
  };
</script>

<style lang="scss" scoped>
</style>
